小程序的填坑之路

一,组件运用

1.view-scroll横向滑动

//wxml中代码
<view class="container">
    <view class="section">
        <scroll-view  scroll-x="true" style="width:100%;">
            <view class="a scroll-item">a</view>
            <view class="b scroll-item">b</view>
            <view class="c scroll-item">c</view>
        </scroll-view>
    </view>
</view>

wxss中注意,我之前是在.section中display:inline-block的,但是scroll-view中的三项还是以block的形式排列,将每个scroll-item设置为display:inlne-block才以行内块的形式显示;还要将scroll-view设置为不回车显示white-space:nowrap;

.container{
  width:100%;

}
.section{
  width:100%;
  height:300rpx;
}
scroll-view{
    width:100%;
    white-space:nowrap;
}
.scroll-item{
  width:100%;
  height:300rpx;
  display: inline-block;
}
.a{
  background:yellow;

}
.b{
  background: silver;
}
.c{
  background: pink;
}